<script setup lang="ts">
import { onMounted } from 'vue';
import $ from 'jquery';
 
onMounted(() => {
    // 侧边栏固定初始化
    $('#primary').theiaStickySidebar({
        // Settings
        additionalMarginTop: 72,
        additionalMarginBottom: 0
    });
});
</script>
<template>
   <main class="main">
        <!-- 位置导航 -->
        <slot name="navigation"></slot>
        <div class="ui stackable grid">
            <!--左边-->
            <div class="twelve wide column">
                <slot name="leftColumn"></slot>
            </div>
            <!--右边-->
            <div class="four wide column" id="primary">
                <div class="sidebar"> 
                    <slot name="rightColumn"></slot>
                </div>
            </div>
        </div>
        <!-- 主体底部 -->
        <div class="bottom">
            <slot name="bottom"></slot>
        </div>
    </main>
</template>
<!-- 引入样式文件 -->
<style lang="less" src="./style.less" />